<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
    <meta charset="UTF-8">
    <title>分页</title>
    <link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <script src="../bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
    <script src="../bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="../bower_components/angular/angular.min.js" type="text/javascript"></script>
    <script src="../bower_components/angular-resource/angular-resource.js" type="text/javascript"></script>
</head>
<body ng-controller="myController" class="container">
<div class="panel panel-default">
        <page></page>
    </div>
</div>
</body>
<script>
    var app = angular.module('app', ['ngResource']);
    app.factory('bookService', function ($resource) {
        return $resource("/book:id",
            //将路径上的参数绑定指向对象的id
            {id: '@id'},
            //新增加的方法
            {
                update: {
                    method: 'PUT'
                }
            })

    });
    app.controller('myController', function ($scope, bookService) {
        $scope.books = [];
        $scope.size = 2;
        $scope.booksList = [];
        $scope.pageConfig={};
        $scope.pageConfig.pageList=[1,2,3];
        $scope.pageConfig.current=1;
        $scope.find = function () {
            /**
             * get:获取单个数据，
             * query:获取所有
             */
            bookService.query().$promise.then(function (data) {
                console.log(data);
                var pageSize = 2;
                $scope.booksList = data;
                $scope.total =  $scope.booksList.length;
                $scope.pageConfig.pageList.length =Math.ceil( $scope.total/pageSize);
                for(let [key,value] of $scope.pageConfig.pageList.entries()){
                    $scope.pageConfig.pageList[key]=key+1;
                }
                console.log($scope.pageConfig.pageList)
                $scope.selectPage();

            })
        };

        $scope.selectPage=function (num) {
            $scope.pageConfig.current=num || 1;
            console.log(($scope.pageConfig.current-1)*2+2);
            console.log(($scope.pageConfig.current-1)*2);
            var start = ($scope.pageConfig.current-1)*2;
            var end =start+2;
            $scope.books=$scope.booksList.slice(start,end)
        };

    })
    app.directive("page",function () {
        return {
            restrict:'E',
            replace:true,
            template:'<h1>{{size}}</h1>',
            controller:function () {

            }
        }
    })

</script>
</html>